<template>
    <div class="app">
    <el-row type="flex" @click="$router.push('/home/updateName')" class="node-box-item " justify="space-between">
        <el-col :span="10" >
        <span class="icon-left el-icon-edit-outline"></span>
        <span class="icon-left-text">修改用户昵称</span>
        </el-col>
        <el-col :span="9"  class="icon-right">
        <span class="el-icon-arrow-right"></span>
        </el-col>
    </el-row>
    <el-row type="flex" @click="$router.push('/home/updatePwd')" class="node-box-item" justify="space-between">
        <el-col :span="10" >
        <span class="icon-left el-icon-lock"></span>
        <span class="icon-left-text">修改密码</span>
        </el-col>
        <el-col :span="9"  class="icon-right">
        <span class="el-icon-arrow-right"></span>
        </el-col>
    </el-row>
    <el-row type="flex" @click="$router.push('/home/VoteHistory')"  class="node-box-item" justify="space-between">
        <el-col :span="10" >
        <span class="icon-left el-icon-date"></span>
        <span class="icon-left-text">查看投票记录</span>
        </el-col>
        <el-col :span="9"  class="icon-right">
        <span class="el-icon-arrow-right"></span>
        </el-col>
    </el-row>
    <el-row type="flex" @click="$router.push('/vote')" class="node-box-item hidden-xs-only" justify="space-between">
        <el-col :span="10" >
        <span class="icon-left el-icon-edit-outline"></span>
        <span class="icon-left-text">发起投票</span>
        </el-col>
        <el-col :span="9"  class="icon-right">
        <span class="el-icon-arrow-right"></span>
        </el-col>
    </el-row>
    <el-row type="flex" @click="outUser" class="node-box-item" justify="space-between">
        <el-col :span="10" >
        <span class="icon-left el-icon-close"></span>
        <span class="icon-left-text">退出登录</span>
        </el-col>
        <el-col :span="9"  class="icon-right">
        <span class="el-icon-arrow-right"></span>
        </el-col>
    </el-row>
    </div>
</template>

<script type="text/ecmascript-6">
import { defineComponent } from "vue";
import { useRouter } from "vue-router";

export default defineComponent({
  name: "VoteDetail",
  setup() {
         const router = useRouter()

        //退出登录
        function outUser(){
            window.sessionStorage.removeItem('info')
            router.replace('/login')
        }

        //修改密码
        function updatePwd(){
            console.log('修')
            router.push('/home/updatePwd')
        }
        return {
            outUser,
            updatePwd
        }
  },
});
</script>

<style scoped lang="less" >
@back:#789eff;
@iconBack:#D4EBFD;
@color:#0B9CE9;
.app{
    height: 65vh;
}
.node-box-item{
    padding: 10px 0px;
    border-bottom: 1px solid #eee;

    .icon-left{
        display: inline-block;
        text-align: center;
        border-radius: 50%;
        line-height: 30px;
        width: 30px;
        height: 30px;
        background: @iconBack;
        color: @color;
    }

    .icon-left-text{
        margin-left: 10px;
    }
    .icon-right{
        text-align: right;
        line-height: 30px;

    }
}


</style>
